Date.prototype.Format = function (fmt) {
    var o = {
        "M+": this.getMonth() + 1, //月份
        "d+": this.getDate(), //日
        "H+": this.getHours(), //小时
        "m+": this.getMinutes(), //分
        "s+": this.getSeconds(), //秒
        "q+": Math.floor((this.getMonth() + 3) / 3), //季度
        "S": this.getMilliseconds() //毫秒
    };
    if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
    for (var k in o)
        if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
    return fmt;
}
$(function () {
    $(".list-group-item").click(function () {
        $(".list-group-item").removeClass('actived')
        $(".list-group-item").addClass('list-group-item-action')
        $(this).addClass('actived')
        $(this).removeClass('list-group-item-action')
    })
    loadDefault()
    $("#default").click(function () {
        loadDefault()
    })
    $("#user").click(function () {
        loadUser()
    })
    $("#blog").click(function () {
        loadBlog()
    })
    $("#comment").click(function () {
        loadComment()
    })
    $("#reprintBlog").click(function () {
        loadPyApi()
    })
    $("#file").click(function () {
        loadFile()
    })
    $("#logout").click(function () {
        if(confirm('是否确认退出？')) {
            $.post("/demo/logout",function (rst) {
                if (rst == "success") {
                    window.location.href = "/demo/login"
                } else {
                    alert("登出失败")
                }
            })
        }
    })
})

function loadUser() {
    $("#main").html(`<h1 class="page-header">管理</h1>
            <div class="table-responsive">
                <table class="table table-striped table-hover">
                    <thead>
                    <tr id="manageHeader">
                        <th><span class="glyphicon glyphicon-th-large"></span> <span class="visible-lg">ID</span></th>
                        <th><span class="glyphicon glyphicon-user"></span> <span class="visible-lg">用户名</span></th>
                        <th><span class="glyphicon glyphicon-bookmark"></span> <span class="visible-lg">姓名</span></th>
                        <th><span class="glyphicon glyphicon-pushpin"></span> <span class="visible-lg">文章</span></th>
                        <th><span class="glyphicon glyphicon-time"></span> <span class="visible-lg">上次登录时间</span></th>
                        <th><span class="glyphicon glyphicon-pencil"></span> <span class="visible-lg">操作</span></th>
                    </tr>
                    </thead>
                    <tbody id="manageObject">
                    </tbody>
                </table>
            </div>`)
    $.post("/demo/search/userInfo","userLevel="+$("#userLevel").text(),function (rst) {
        for (i = 0; i < rst.length; i ++ ) {
            let userInfo = rst[i]
            $("#manageObject").append(`<tr>
            <td>${userInfo.userId}</td>
            <td>${userInfo.loginName}</td>
            <td>${userInfo.userName}</td>
            <td>${userInfo.blogNum}</td>
            <td>${userInfo.lastLoginTime == null ? "----/--/--" : userInfo.lastLoginTime.substr(0,8).replace(/(\d{4})(\d{2})(\d{2})/, '$1/$2/$3')}</td>
            <td>
                <a class="mr-1"href="#" id="promote_${userInfo.userId}"style="text-decoration: blink;color:black; " onclick="promoteUser(${userInfo.userId})"onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>${$("#userLevel").text() == 2 ? (userInfo.userLevel == 0 ? "设为管理员":"取消管理员"):""}</a>
                <a class="deleteUser" href="#" id="deleteUserId_${userInfo.userId}" onclick="deleteUser(${userInfo.userId})" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>${userInfo.userState == 1?"禁用":"启用"}</a>
            </td>
            </tr>`)
        }
    // <a class="updateUser" href="#" id="updateUserId_${userInfo.userId}" draggable="false">修改</a>
    })
}

function deleteUser(userId) {
    // $(".deleteUser").click(function () {
    if(confirm('是否'+$("#deleteUserId_"+userId).text()+'该用户？')) {
        $.post("/demo/delete/user","userId="+userId,function (rst) {
            if (rst == "success") {
                $("#deleteUserId_"+userId).text($("#deleteUserId_"+userId).text() == "启用"?"禁用":"启用")
            } else alert("失败或权限不足")
        })
    }
    // })
}

function promoteUser(userId) {
    if(confirm('是否为该用户'+$("#promote_"+userId).text())) {
        $.post("/demo/upDate/userInfo","userId="+userId+"&userLevel="+($("#promote_"+userId).text() == "取消管理员"?0:1),function (rst) {
            if (rst == "success") {
                $("#promote_"+userId).text($("#promote_"+userId).text() == "取消管理员"?"设为管理员":"取消管理员")
            } else alert("失败或权限不足")
        })
    }
}

function loadComment() {
    $("#main").html(`<form id="allform" action="/demo/delete/comment" method="post">
                <h1 class="page-header">管理</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr id="manageHeader row ">
                            <th class="col-1"><span class="glyphicon glyphicon-th-large "></span> <span class="visible-lg">选择</span></th>
                            <th class="col-7"><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">内容</span></th>
                            <th class="col-2"><span class="glyphicon glyphicon-time "></span> <span class="visible-lg">日期</span></th>
                            <th class="col-1"><span class="glyphicon glyphicon-pencil "></span> <span class="visible-lg">操作</span></th>
                        </tr>
                        </thead>
                        <tbody id="manageObject">
                        </tbody>
                    </table>
                </div>
                <footer class="message_footer">
                    <div class="d-flex mt-3" style="height: 37px;">
                        <div class="btn-group mr-2">
                            <button type="button" onclick="selectall()" class="btn btn-light border">全选</button>
                            <button type="button" onclick="changeall()" class="btn btn-light border">反选</button>
                            <button type="button" onclick="reselectall()" class="btn btn-light border">不选</button>
                        </div>
                        <button type="button" onclick="deleteComments()"class="btn btn-light border">删除</button>

                    </div>
                </footer>
            </form>`)
    $.post("/demo/search/comment","blogId=-1",function (rst) {
        for (i = 0; i < rst.length; i ++ ) {
            let commentInfo = rst[i]
            $("#manageObject").append(`<tr>
            <td><input type="checkbox" onclick="checkBoxClick()" class="ids" name="commentId_${commentInfo.commentId}" value="${commentInfo.commentId}"></td>
            <td>${commentInfo.content}</td>
            <td>${commentInfo.createDate.substr(0,8).replace(/(\d{4})(\d{2})(\d{2})/, '$1/$2/$3 ')}</td>
            <td>
                <a href="/demo/blog/${commentInfo.blogId}#commentId_${commentInfo.commentId}" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>查看</a> 
                <a href="#" onclick="deleteComment(${commentInfo.commentId})" id="deleteComment_${commentInfo.commentId}"href="#" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>删除</a>
            </td>
            </tr>`)
        }

    })
}

function deleteComment(commentId) {
    // $(".deleteComment").click(function () {
        if(confirm('是否删除评论？')) {
            $.post("/demo/delete/comment","commentId="+commentId,function (rst) {
                if (rst == "success") {
                    $("#deleteComment_"+commentId).parent().parent().remove()
                } else alert("失败或权限不足")
            })
        }

    // })
}

function deleteComments(commentId) {
    // $(".deleteComment").click(function () {
    if(confirm('是否删除所选评论？')) {
        let form=jQuery("#allform").serialize();
        $.post("/demo/delete/comment",form,function (rst) {
            if (rst == "success") {
                $(":checkbox[class='ids']").each(function(){
                    if($(this).prop("checked")){
                        $(this).parent().parent().remove()
                    }
                });
            } else alert("失败或权限不足")
        })
    }

    // })
}


function loadBlog() {
    $("#main").html(`<form id="allform">
                <h1 class="page-header">管理</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr id="manageHeader">
                            <th><span class="glyphicon glyphicon-th-large"></span> <span class="visible-lg">选择</span></th>
                            <th><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">标题</span></th>
                            <th><span class="glyphicon glyphicon-list"></span> <span class="visible-lg">作者</span></th>
                            <th class="hidden-sm"><span class="glyphicon glyphicon-tag"></span> <span class="visible-lg">标签</span></th>
                            <th class="hidden-sm"><span class="glyphicon glyphicon-comment"></span> <span class="visible-lg">评论</span></th>
                            <th><span class="glyphicon glyphicon-time"></span> <span class="visible-lg">日期</span></th>
                            <th><span class="glyphicon glyphicon-pencil"></span> <span class="visible-lg">操作</span></th>
                        </tr>
                        </thead>
                        <tbody id="manageObject">
                        </tbody>
                    </table>
                </div>
                <footer class="message_footer">
                    <div class="d-flex mt-3" style="height: 37px;">
                        <div class="btn-group mr-2">
                            <button type="button" onclick="selectall()" class="btn btn-light border">全选</button>
                            <button type="button" onclick="changeall()" class="btn btn-light border">反选</button>
                            <button type="button" onclick="reselectall()" class="btn btn-light border">不选</button>
                        </div>
                        <button type="button" onclick="deleteBlogs()"class="btn btn-light border">删除</button>

                    </div>
                </footer>
            </form>`)
    $.post("/demo/search","blogId=-1&userId=-1",function (rst) {
        for (i = 0; i < rst.length; i ++ ) {
            let blogInfo = rst[i]
            $("#manageObject").append(`<tr>
                <td><input type="checkbox" onclick="checkBoxClick()" class="ids" name="deleteBlog_${blogInfo.blogId}" value="${blogInfo.blogId}"></td>
                <td class="article-title">${blogInfo.blogTitle}</td>
                <td>${blogInfo.userInfo.userName}</td>
                <td class="hidden-sm">${blogInfo.blogTags}</td>
                <td class="hidden-sm">${blogInfo.commentNum}</td>
                <td>${blogInfo.createDate.substr(0,8).replace(/(\d{4})(\d{2})(\d{2})/, '$1/$2/$3')}</td>
                <td>
                    <a href="/demo/blog/${blogInfo.blogId}" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>查看</a> 
                    <a class="deleteBlog" href="#" onclick="deleteBlog(${blogInfo.blogId})"id="deleteBlog_${blogInfo.blogId}" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>删除</a>
                </td>
            </tr>`)
        }
    })
}

function deleteBlog(blogId) {
    // $(".deleteBlog").click(function () {
        if(confirm('是否删除博客？')) {
            $.post("/demo/delete/blog","blogId="+blogId,function (rst) {
                if (rst == 1) {
                    $("#deleteBlog_"+blogId).parent().parent().remove()
                } else alert("失败或权限不足")
            })
        }

    // })
}

function deleteBlogs() {
    // $(".deleteBlog").click(function () {

    if(confirm('是否删除所选博客？')) {
        let form=jQuery("#allform").serialize();
        $.post("/demo/delete/blog",form,function (rst) {
            if (rst == 1) {
                $(":checkbox[class='ids']").each(function(){
                    if($(this).prop("checked")){
                        $(this).parent().parent().remove()
                    }
                });
            } else alert("失败或权限不足")
        })
    }

    // })
}

function selectall()
{
    jQuery("input[class='ids']").prop("checked",true);
}

function changeall()
{
    $(":checkbox[class='ids']").each(function(){
        if($(this).prop("checked")){
            $(this).prop("checked",false);
        }else{
            $(this).prop("checked",true)
        }
    });
}

function checkBoxClick() {
    if($(this).prop("checked")){
        $(this).prop("checked",false);
    }else{
        $(this).prop("checked",true)
    }
}

function reselectall()
{
    jQuery("input[class='ids']").prop("checked",false);
}

function loadDefault() {
    $.post("/demo/search/serverInfo",function (rst) {
        $("#main").html(`<h1 class="page-header">信息总览</h1>

                <table class="table table-striped table-hover">
                    <tbody>
                        <tr class="d-flex justify-content-around">
                            <td class="col-xs-6 col-sm-3">
                                <h4 class="text-center">文章</h4>
                                <div class="text-center text-muted">${rst.blogNum}条</div>
                            </td>
                            <td class="col-xs-6 col-sm-3">
                                <h4 class="text-center">评论</h4>
                                <div class="text-center text-muted">${rst.CommentNum} 条</div>
                            </td>
                            <td class="col-xs-6 col-sm-3">
                                <h4 class="text-center">用户数</h4>
                                <div class="text-center text-muted">${rst.userNum}人</div>
                            </td>
                        </tr>
                    </tbody>
                </table>
                <h1 class="page-header">状态</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <tbody>
                        <tr>
                            <td>登录者: <span>${$("#userName").text()}</span></td>
                        </tr>
                        <tr>
                            <td>上次登录时间: <span>${$("#lastLoginTime").text() == null ? "----/--/-- --/--/--" : $("#lastLoginTime").text().replace(/(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/, '$1/$2/$3 $4:$5:$6')}</span></td>
                        </tr>
                        </tbody>
                    </table>
                </div>
                <h1 class="page-header">系统信息</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr> </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td>管理员个数:</td>
                            <td>${rst.manageUserNum} 人</td>
                            <td>浏览器:</td>
                            <td>Chrome47</td>
                        </tr>
                        <tr>
                            <td>操作系统:</td>
                            <td>Windows 10</td>
                            <td>上传文件:</td>
                            <td>可以 <font size="-6" color="#BBB">(最大文件：2M ，表单：8M )</font></td>
                        </tr>
                        <tr>
                            <td>登录者IP:</td>
                            <td>${returnCitySN["cip"]}</td>
                            <td>MYSQL版本:</td>
                            <td>5.5.40</td>
                        </tr>
                        <tr>
                            <td>程序编码:</td>
                            <td>UTF-8</td>
                        </tr>
                        </tbody>
                        <tfoot>
                        <tr></tr>
                        </tfoot>
                    </table>
                </div>`)
    })
}

function loadPyApi() {
    $("#main").html(`
                <h1 class="page-header">操作</h1>
                <ol class="breadcrumb">
                  <li class="w-100">
                  <form class="d-flex" id="urlForm">
                    <input type="url" class="form-control w-75" id="url" name="url"style="width: 90%">
                    <a class="findBlog m-auto" href="#" onclick="findBlog()"id="findBlog" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>加载文章</a>
                  </form>
                  </li>
                </ol>
                <form id="allform">
                <h1 class="page-header">管理</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr id="manageHeader row">
                            <th class="col-1"><span class="glyphicon glyphicon-th-large"></span> <span class="visible-lg">选择</span></th>
                            <th class="col-4"><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">标题</span></th>
                            <th class="col-5"><span class="glyphicon glyphicon-list"></span> <span class="visible-lg">标签</span></th>
                            <th class="col-2"><span class="glyphicon glyphicon-pencil"></span> <span class="visible-lg">操作</span></th>
                        </tr>
                        </thead>
                        <tbody id="manageObject">
                        </tbody>
                    </table>
                </div>
                <footer class="message_footer">
                    <div class="d-flex mt-3" style="height: 37px;">
                        <div class="btn-group mr-2">
                            <button type="button" onclick="selectall()" class="btn btn-light border">全选</button>
                            <button type="button" onclick="changeall()" class="btn btn-light border">反选</button>
                            <button type="button" onclick="reselectall()" class="btn btn-light border">不选</button>
                        </div>
                        <button type="button" onclick="reprintBlogs()"class="btn btn-light border">转载</button>

                    </div>
                </footer>
            </form>`)
}

function findBlog() {
    let form = $("#urlForm").serialize()
    alert(form)
    $("#manageObject").html("")
    $.post("http://127.0.0.1:8000/blogs/find/",form,function (rst) {
        // alert(rst)
        rst = rst.split(',,!,!,,')
        for (i = 0; i+1 < rst.length; i += 3 ) {
            // alert(rst[i])
            $("#manageObject").append(`<tr >
                <td><input type="checkbox" onclick="checkBoxClick()" class="ids" name="selectBlogId_${i/3}" value=""></td>
                <td class="article-title">${rst[i]}</td>
                <td>${rst[i+1].split(',!,!,')}</td>
                <td>
                    <a href="${rst[i+2]}" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>查看</a> 
                </td>
            </tr>`)
        }
    })
}

function reprintBlogs() {
    if(confirm('是否转载所选博客？')) {
        let form=jQuery("#allform").serialize();
        var  reg=new  RegExp("selectBlogId_","g");
        form = form.replace(reg,'')
        var reg2=new  RegExp("&","g");
        form = form.replace(reg2,'%2C')
        var reg3=new  RegExp("=","g");
        form = form.replace(reg3,'')
        form = "select="+form
        alert(form);
        $.post("http://127.0.0.1:8000/blogs/select/",form,function (rst) {
            if (rst == "success") {
                alert("success")
                $("#manageObject").html("")
            } else alert("失败或权限不足")
        })
    }
}


function loadFile() {
    $("#main").html(`<form id="allform" action="/demo/delete/file" method="post">
                <h1 class="page-header">管理</h1>
                <div class="table-responsive">
                    <table class="table table-striped table-hover">
                        <thead>
                        <tr id="manageHeader row ">
                            <th class="col-1"><span class="glyphicon glyphicon-th-large "></span> <span class="visible-lg">选择</span></th>
                            <th class="col-7"><span class="glyphicon glyphicon-file"></span> <span class="visible-lg">文件名</span></th>
                            <th class="col-2"><span class="glyphicon glyphicon-time "></span> <span class="visible-lg">上传者</span></th>
                            <th class="col-1"><span class="glyphicon glyphicon-pencil "></span> <span class="visible-lg">操作</span></th>
                        </tr>
                        </thead>
                        <tbody id="manageObject">
                        </tbody>
                    </table>
                </div>
                <footer class="message_footer">
                    <div class="d-flex mt-3" style="height: 37px;">
                        <div class="btn-group mr-2">
                            <button type="button" onclick="selectall()" class="btn btn-light border">全选</button>
                            <button type="button" onclick="changeall()" class="btn btn-light border">反选</button>
                            <button type="button" onclick="reselectall()" class="btn btn-light border">不选</button>
                        </div>
                        <button type="button" onclick="deleteFiles()"class="btn btn-light border">删除</button>

                    </div>
                </footer>
            </form>`)
    $.post("/demo/search/files",function (rst) {
        for (i = 0; i < rst.length; i ++ ) {
            let fileInfo = rst[i]
            $("#manageObject").append(`<tr>
            <td><input type="checkbox" onclick="checkBoxClick()" class="ids" name="fileId_${fileInfo.fileId}" value="${fileInfo.fileId}"></td>
            <td>${fileInfo.fileName}</td>
            <td>${fileInfo.userInfo.userName}</td>
            <td>
                <a href="${fileInfo.fileUrl}" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>查看</a> 
                <a href="#" onclick="deleteFile(${fileInfo.fileId})" id="deleteFile_${fileInfo.fileId}"href="#" style="text-decoration: blink;color:black; "onmouseover='$(this).attr("style","text-decoration: blink;color:#00a8c6;")' onmouseout='$(this).attr("style","text-decoration: blink;color:black;")'>删除</a>
            </td>
            </tr>`)
        }

    })
}


function deleteFile(fileId) {
    // $(".deleteBlog").click(function () {
    if(confirm('是否删除文件？')) {
        $.post("/demo/delete/file","fileId="+fileId,function (rst) {
            if (rst == 1) {
                $("#deleteFile_"+fileId).parent().parent().remove()
            } else alert("失败或权限不足")
        })
    }

    // })
}

function deleteFiles() {
    // $(".deleteBlog").click(function () {

    if(confirm('是否删除所选文件？')) {
        let form=jQuery("#allform").serialize();
        alert(form)
        $.post("/demo/delete/file",form,function (rst) {
            if (rst == 1) {
                $(":checkbox[class='ids']").each(function(){
                    if($(this).prop("checked")){
                        $(this).parent().parent().remove()
                    }
                });
            } else alert("失败或权限不足")
        })
    }

    // })
}